<template>
    <div class="user-chat">
        <!-- 导航栏 -->
        <van-nav-bar
            title="小智同学"
            left-arrow
            @click-left="$router.back()"
            class="app-nav-bar"
        />
        <!-- /导航栏 -->

        <!-- 消息列表 -->
        <van-cell-group class="message-list">
            <van-cell title="hhh"/>
            <van-cell title="我"/>
            <van-cell title="别"/>
            
        </van-cell-group>
         <!-- /消息列表 -->

         <!-- 发送消息 -->
         <van-cell-group class="send-message-wrap">
            <van-field 
                v-model="value" 
                placeholder="请输入消息" 
                :border="false"
            />
            <van-button size="small" class="btn" type="primary">发送</van-button>
         </van-cell-group>
         <!-- /发送消息 -->
    </div>
</template>
<script>
export default {
    data() {
        return {
            value:''
        }
    },
}
</script>
<style lang="less" scoped>
.send-message-wrap{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    padding: 0 14px;
    align-items: center;
}
.message-list{
    position: fixed;
    left: 0;
    right: 0;
    top: 46px;
    bottom: 46px;
    overflow-y: auto;
}
.btn{
    width: 50px;
    height: 25px;
}
</style>